﻿@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <title>Contact</title>
<style>
#header{
    letter-spacing: 1px;
    position: relative;
    text-align: right;
    top:0px;
    left:0px;
    z-index:1;
    width:100%;
    height:55px;
    border-bottom:1px solid #cccccc;
    -moz-box-shadow: 0px 2px 5px #cccccc;
    -webkit-box-shadow: 0px 2px 5px #cccccc;
    box-shadow: 0px 2px 5px #cccccc;
    -webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
}

#center{
    z-index:100;
    position:relative;
    height:490px;
    width:100%;
    background-color: #D7D7D7;
    -moz-box-shadow:inset 0px -2px 26px #cccccc;
    -webkit-box-shadow:inset 0px -2px 26px #cccccc;
    box-shadow:inset 0px -2px 26px #cccccc;
    -webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
}

.backus-box{
    position:absolute;
    width:640px;
    height:350px;
    top: 50%;
    margin-top: -175px;
    left:50%;
    margin-left:-320px;
    background-color:#FFFFFF;
    border-radius: 2px;
    -moz-box-shadow: 0 4px 10px rgba(0, 0, 0, .3);
    -webkit-box-shadow: 0 4px 10px rgba(0, 0, 0, .3);
}

.backus-item{
    overflow-y:auto;
    overflow-x: hidden;
    width: 640px;
    height: 350px;
}

.backus-tips{
    position:relative;
    height:30px;
    width:600px;
    top:10px;
    padding-left:40px;
    font-family:"微软雅黑";
    font-size:15px;
    color:#EB9546;
}

.new-message-input-box{
    margin-left: 40px;
    border: 1px solid #C4C4C4;
    cursor: text;
    position: relative;
    width: 560px;
    height: 130px;
    top: 20px;
    -webkit-box-shadow: inset 0 1px 2px #DDD;
    -moz-box-shadow: inset 0 1px 2px #ddd;
    box-shadow: inset 0 1px 2px #DDD;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: inset 0 1px 2px #DDD;
    -moz-box-shadow: inset 0 1px 2px #ddd;
    box-shadow: inset 0 1px 2px #DDD;
}

.new-message-input{
    padding: 5px 10px;
    width:100%;
    height: 100px;
    font-size:14px;
    line-height:22px;
    border: none;
    outline: none;
    resize: none;
    border:0px solid #FFF;
}

.send-btn{
    position:relative;
    height:28px;
    width:80px;
    background-color:#EB9546;
    margin-left:40px;
    top:55px;
    font-family:"微软雅黑";
    font-size:16px;
    text-align:center;
    line-height:28px;
    color:#FFFFFF;
    cursor:pointer;
    -webkit-user-select: none;
    -moz-user-select: -moz-none;
}

.return-btn{
    position:relative;
    height:28px;
    width:80px;
    background-color:#EB9546;
    margin-right:40px;
    top:55px;
    font-family:"微软雅黑";
    font-size:16px;
    text-align:center;
    line-height:28px;
    color:#FFFFFF;
    cursor:pointer;
    -webkit-user-select: none;
    -moz-user-select: -moz-none;
}
a{
    color:#fff;
    text-decoration:none;
}
</style>

<link href="@Url.Content("~/Content/themes/messenger/messenger.css")" rel="stylesheet" type="text/css"/>
<link href="@Url.Content("~/Content/themes/messenger/messenger-theme-future.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/bootstrap.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/bootstrap-responsive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/messenger.min.js")" type="text/javascript"></script>
    
<script>    
    function sendAdvise() {
        var backus = document.getElementById("backus-input").value.toString();
        $.post("/Account/SendAdvise", { "advise": backus },
            function (data) {
                $("#backus-input").val("");
                if (data == 1) {
                    $.globalMessenger().post("您的意见已成功发送！");
                }
                else
                    $.globalMessenger().post({
                        message: '由于网络原因，请稍后重试！',
                        type: 'error',
                        showCloseButton: true
                    });
            });
    }

</script>

</head>

<body>
    <div id="header">
            <a href="LogOn"><img src="../../Content/image/heading.jpg" alt="FairyWorld" style="width:150px; padding:15px"/></a>
    </div>

    <div id="center">
        <div  class="backus-box">
            <div class="backus-item">
                <img src="../../Content/image/logo.png" alt="FairyWorld" style="width:50px; padding:15px"/>
                <div class="backus-tips">
                    尊敬的用户，感谢您的使用！请告诉我们您的建议：
                </div>
                <div class="new-message-input-box">
                    <div style="position:relative; padding-right:20px;">
                        <textarea id="backus-input" class="new-message-input" name="" cols="" rows=""onkeydown=""></textarea>
                    </div>
                </div>
                <div class="send-btn" onclick="sendAdvise()" style="float:left">发送</div>               
                <div class="return-btn" style="float:right">@Html.ActionLink("返回", "Logon")</div>
            </div>
        </div>          
    </div>
</body>
</html>
